<template>
    <div class="video-wrapper container-channel">
        <van-list
            v-model="loading"
            :finished="finished"
            class="video-list"
            finished-text="没有更多了"
            @load="onLoad"
        >
            <ul class="clearfix">
                <router-link to="/playing" class="video-item" tag="li" 
                    v-for="n in 15"
                    :key="n"
                >
                    <VideoItem></VideoItem>
                    <p class="video-media-desc"><time>2019-07-12 13:56:09</time></p>
                </router-link>
            </ul>
        </van-list>
    </div>
</template>

<script>
import VideoItem from '@/components/VideoItem';
export default {
  components: {
      VideoItem
  },
  props: {},
  data() {
    return {
        loading: false,
        finished: false,
    };
  },
  computed: {},
  methods: {
      onLoad(){}
  },
  created() {},
  mounted() {}
};
</script>
<style lang="scss" scoped>
.video-wrapper {
    height: 100%;
    overflow: auto;
    .video-list {
        padding: 30px 0 0;
        .video-item {
            float: left;
            width: 50%;
            padding: 0 16px;
            margin-bottom: 20px;
        }

        .video-media-desc {
            font-size: 26px;
            line-height: 60px;
            color: #999;
            text-align: center;
        }
    }
}

</style>